<!--
     Any copyright is dedicated to the Public Domain.
     http://creativecommons.org/publicdomain/zero/1.0/
-->
<svg id="svg-root"
  xmlns="http://www.w3.org/2000/svg"
  xmlns:xlink="http://www.w3.org/1999/xlink">

  <g id="testmeta">
    <title>SVG Filter Chains: Don't Clip Primitives in Previous Filters to Subsequent Filter Regions</title>
    <link rel="copyright"
          href="http://www.w3.org/Graphics/SVG/Test/Copyright"/>
    <link rel="license"
          href="http://www.w3.org/Consortium/Legal/2008/03-bsd-license.html"/>
    <link rel="author"
          title="Max Vujovic"
          href="mailto:mvujovic@adobe.com"/>
    <link rel="help"
          href="http://dev.w3.org/fxtf/filters/#FilterPrimitiveSubRegion"/>
    <link rel="match"
          href="dont-clip-previous-primitives.svg" />
    <metadata class="flags">namespace svg</metadata>
    <desc class="assert">
      In an SVG filter chain, this test verifies that a second filter's filter
      region does not clip the primitives inside a first filter. If the test
      passes, you should see a green square.
    </desc>
  </g>

  <g id="test-body-content">
    <!-- Use a wide filter region. -->
    <filter id="f1" x="0" y="0" width="200" height="100" filterUnits="userSpaceOnUse">
      <!-- Create a red square at x=100. -->
      <feFlood flood-color="red" x="100" y="0" width="100" height="100"/>
      <!-- Offset the red square left to x=0. -->
      <feOffset dx="-100" x="0" y="0" width="200" height="100"/>
    </filter>
    <!--
      Use a less wide filter region. The intermediate results of the previous
      filter do not fit in this filter region, but that shouldn't matter. The
      previous filter's intermediate results should not be affected by this
      filter region. The final result of the previous filter should fit in this
      filter region.
    -->
    <filter id="f2" x="0" y="0" width="100" height="100" filterUnits="userSpaceOnUse">
      <!-- Turn the red square into a green square. -->
      <feColorMatrix type="hueRotate" values="90"/>
    </filter>
    <rect x="0" y="0" width="100" height="100" filter="url(#f1) url(#f2)" fill="blue"/>
  </g>
</svg>
